<script setup>
import { ref } from 'vue'
import request from '@/utils/request'
const dialogVisible = ref(false)
const ParentLevelData = ref({})
const emit = defineEmits(['success'])
const upd_work_form = ref({
  work_value: 0
})
const rules = ref({
  work_value: [
    {
      validator(rule, value, callback) {
        if (ParentLevelData.value.type == 'upd') {
          if (value <= 0) {
            // 校验不通过
            return callback(new Error('工作量必须大于0'))
          } else {
            // 校验通过
            callback()
          }
        } else {
          if (value <= 0) {
            // 校验不通过
            return callback(new Error('工作量必须大于0'))
          } else if (value > ParentLevelData.value.committedWorkloads) {
            // 校验不通过
            return callback(new Error('确认工作量必须小于完成的工作量'))
          } else {
            // 校验通过
            callback()
          }
        }
      }
    }
  ]
})
const upd_work_ref_form = ref()
//确定事件
const confirm = async () => {
  await upd_work_ref_form.value.validate()
  request({
    url: '/task_allocation/addOrUpdate',
    method: 'post',
    data: {
      id: ParentLevelData.value.id,
      month: ParentLevelData.value.month,
      operateType: ParentLevelData.value.type == 'upd' ? 1 : 2,
      userId: ParentLevelData.value.userId,
      workloads: upd_work_form.value.work_value,
      year: ParentLevelData.value.year
    }
  }).then((res) => {
    dialogVisible.value = false
    ElMessage({
      type: 'success',
      message: ParentLevelData.type == 'upd' ? '修改成功' : '确认成功'
    })
    emit('success')
  })
}

// 组件对外暴露一个方法 open,  基于 open 的参数，初始化表单数据，并判断区分是添加 还是 编辑
//1. open({ })                   =>  添加操作，添加表单初始化无数据
//2. open({ id: xx,  ...  })  =>  编辑操作，编辑表单初始化需回显
//open调用后，可以打开弹窗
const open = async (row) => {
  dialogVisible.value = true
  ParentLevelData.value = row
  upd_work_form.value.work_value = row.type == 'upd' ? row.workloads : row.committedWorkloads
}
//暴露方法
defineExpose({
  open
})
</script>

<template>
  <el-dialog
    v-if="dialogVisible"
    v-model="dialogVisible"
    :title="ParentLevelData.type == 'upd' ? '修改当月工作量' : '确认每月工作量'"
    center
    width="30%"
  >
    <div>
      <!-- 修改员工工作量表单 -->
      <el-form
        ref="upd_work_ref_form"
        :model="upd_work_form"
        :rules="rules"
        label-width="180px"
        style="padding-right: 30px"
      >
        <el-form-item
          :label="ParentLevelData.type == 'upd' ? '当前每月工作量：' : '当前完成工作量：'"
        >
          {{
            ParentLevelData.type == 'upd'
              ? ParentLevelData.workloads
              : ParentLevelData.committedWorkloads
          }}
        </el-form-item>
        <el-form-item
          :label="ParentLevelData.type == 'upd' ? '修改当月工作量为：' : '确认当月工作量为：'"
          prop="work_value"
        >
          <el-input
            type="number"
            v-model="upd_work_form.work_value"
            :placeholder="ParentLevelData.type == 'upd' ? '请输入每月工作量' : '请输入确认工作量'"
          />
        </el-form-item>
      </el-form>
    </div>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="dialogVisible = false">取消</el-button>
        <el-button @click="confirm" type="primary"> 确认 </el-button>
      </span>
    </template>
  </el-dialog>
</template>
